<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <link rel="stylesheet" href="res/css/main.css">
    <link rel="stylesheet" href="res/css/bootstrap.min.css">
</head>
<body>

<nav class="navbar navbar-default">
    <div class="container-fluid">
        <div class="navbar-header">
            <a href="#" class="navbar-brand">Booleam</a>
        </div>
        <div class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <li><a href="#">首页</a></li>
                <li><a href="#">博客</a></li>
                <li><a href="#">其他</a></li>
                <li><a href="#">关于</a></li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li><a href="#" type="button" data-toggle="modal" data-target="#loginModal">登录</a></li>
                <li><a href="#" type="button" data-toggle="modal" data-target="#registerModal">注册</a></li>
            </ul>
        </div>
    </div>
</nav>

<div class="modal fade" id="loginModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">登录</h4>
            </div>
            <div class="modal-body">
                <div class="form-login">
                    ${error}
                    <div class="form-group">
                        <label for="login-username" class="col-sm-2 control-label">用户名:</label>
                        <div class="col-sm-10">
                            <input type="text" name="username" class="form-control" id="login-username">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="login-password" class="col-sm-2 control-label">密码:</label>
                        <div class="col-sm-10">
                            <input type="password" name="password" class="form-control" id="login-password">
                        </div>
                    </div>
                    <div class="form-group">
                        <button class="btn btn-default" onclick="login()">登录</button>
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<button onclick="test()">Test</button>

<div class="modal fade" id="registerModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">注册</h4>
            </div>
            <div class="modal-body">
                <div class="form-register">
                    ${error}
                    <div class="form-group">
                        <label for="register-username" class="col-sm-2 control-label">用户名:</label>
                        <div class="col-sm-10">
                            <input type="text" name="username" class="form-control" id="register-username">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="register-password" class="col-sm-2 control-label">密码:</label>
                        <div class="col-sm-10">
                            <input type="password" name="password" class="form-control" id="register-password">
                        </div>
                    </div>
                    <div class="form-group">
                        <button class="btn btn-default" onclick="register()">登录</button>
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="res/js/jquery-2.1.1.min.js"></script>
<script src="res/js/jquery.json.js"></script>
<script src="res/js/bootstrap.min.js" ></script>
<script src="res/js/main.js"></script>
</body>
</html>
